<template>
	<view class="bg-white">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">调岗申请新增</block>

		</cu-custom>
		<view style="padding: 15px;">
			<form>
				<view>
					<image style="width: 100rpx;height: 100rpx;" :src="dataObj.avatar"></image>
				</view>
				<view class="cu-form-group">
					<view class="title">姓名</view>
<!--					<my-select range-key="text" value-key="value" dict-code="sys_user,realname,id" v-model="userId" />-->
                    <my-seach-select range-key="realname" value-key="id"  searchUrl="/sys/user/list" v-model="userId"
					:defaultParams="{
					  jobStatus: '1,2',
					  pageNo: 1,
					  pageSize: -1,
					  company: Auth_Company_Id,
					}"
					 />
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">工号</view>
					<input disabled v-model="dataObj.workNo" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">籍贯</view>
					<input disabled v-model="dataObj.nativePlace" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">性别</view>
					<input disabled v-model="dataObj.sex_dictText" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">年龄</view>
					<input disabled v-model="dataObj.age" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">学历</view>
					<input disabled v-model="dataObj.education_dictText" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">司龄</view>
					<input disabled v-model="dataObj.seniority" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">公司</view>
					<input disabled v-model="dataObj.company_dictText" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">原部门</view>
					<input disabled v-model="dataObj.departIds_dictText" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">原岗位</view>
					<input disabled v-model="dataObj.post" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">原分类</view>
					<input disabled v-model="dataObj.classification" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">原班次</view>
					<input disabled v-model="dataObj.classes" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">原车间</view>
					<input disabled v-model="dataObj.workshop" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>


				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 15px;">
					<view class="title">调岗类型</view>
					<my-select range-key="text" value-key="value" dict-code="job_transfer_type"
						v-model="myFormData.jobTransferType" />
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 15px;">
					<view class="title">新部门</view>
				<!-- 	<view v-if="myFormData.jobTransferType == 3"></view> -->
						
<!-- 						<myPickerDept :companyId="dataObj.company" ref="cascadeSelectionDept" v-model="uniDeptDataPicker" @changeDept="changeDept" /> -->
					
					<view style="margin-left: 10px;overflow: hidden; width: 480rpx;font-size: 25rpx;!important">
						 <uni-data-picker :border="false" style="text-align:right;" placeholder="" :map="{text:'title',value:'id'}" popup-title="请选择部门" v-if="!deptLoading"
							:localdata="dataTree" v-model="uniDeptDataShow"  @clear="clear" @changeDept="changeDept"  @change="onchange" @nodeclick="onnodeclick">
						 </uni-data-picker>
					</view>
				</view>

				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">新公司</view>
					<!-- <my-select range-key="text" value-key="value" dict-code="crm_company,name,id"
						v-model="myFormData.newCompany" /> -->
					<input disabled v-model="myFormData.newCompanyName" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">新车间</view>
					<input disabled v-model="myFormData.newWorkshop" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">新班次</view>
					<input disabled v-model="myFormData.newClasses" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">新岗位</view>
					<input disabled v-model="myFormData.newPost" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">新分类</view>
					<input disabled v-model="myFormData.newClassification" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input>
				</view>
				<!-- <view class="cu-form-group margin-top" style="background-color: #E2E2E2;border-radius: 15px;">
					<view class="title">新计费标准</view> -->
					<!-- <input disabled v-model="myFormData.newFreightBasis" placeholder="请输入" name="input"
						style="margin-left: 20px;"></input> -->
						<!-- <my-select range-key="text" value-key="value" dict-code="freight_basis" 
							v-model="myFormData.newFreightBasis" /> -->
				<!-- </view> -->

				<!-- <view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 15px;">
					<view class="title">新岗位</view>
					<my-select range-key="text" value-key="value" dict-code="sys_position,name,code"
						v-model="myFormData.newPost" />
				</view> -->
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 15px;">
					<view class="title">调岗原因</view>
					<input placeholder="请输入调岗原因" name="input" v-model="myFormData.reason"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 15px;">
					<view class="title">是否使用新工号</view>
					<my-select range-key="text" value-key="value" dict-code="yn" v-model="myFormData.newWorkNoFlag" />
				</view>
				<view class="cu-form-group margin-top"
					style="z-index:99; background-color: #F4F4F4;border-radius: 15px;"
					v-if="myFormData.newWorkNoFlag == '1'">
					<view class="title">新工号</view>
					<input disabled placeholder="请输入新工号" name="input" v-model="myFormData.newWorkNo"></input>
				</view>
			</form>
			<view style="display: flex;margin-top: 15px;justify-content: space-between;align-items: center;">
				<view @click="submit"
					style="padding: 30rpx 110rpx; margin-left: 20rpx;margin-top: 20rpx; background-color: rgba(30, 94, 255, 1);border-radius: 30rpx;color: #FFFFFF;">
					提交审核
				</view>
				<view @click="save"
					style="padding: 30rpx 110rpx;margin-left: 20rpx;margin-top: 20rpx;border-radius: 30rpx;background-color: rgba(255, 173, 4, 1); color: #FFFFFF;">
					保存
				</view>
			</view>

			<uni-popup ref="submitFlag" background-color="#fff" :mask-click="false">
				<view
					style="text-align: center;background-color: #FFFFFF;padding: 11rpx;width: 580rpx;height: 470rpx;border-radius: 42rpx;">
					<view>
						<view class="submit-item">
							<image class="submit-icon" src="@/static/duihaoblue.png" />
						</view>
						<view style="margin-top: 28rpx;">
							<text class="submit-text">调岗申请已经提交</text>
						</view>
						<view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx;">
							<text>已提醒审核人员进行审核</text>
						</view>
						<button @click="sureOne" style="border-radius: 20rpx; background-color: rgba(69, 145, 254, 1);
									color: rgba(255, 255, 255, 1);width: 300rpx;margin-top: 27rpx;">确定</button>
					</view>
				</view>
			</uni-popup>
			<uni-popup ref="draftsFlag" background-color="#fff" :mask-click="false">
				<view>
					<view
						style="text-align: center;background-color: #FFFFFF;padding: 11rpx;width: 580rpx;height: 470rpx;border-radius: 42rpx;">
						<view class="submit-item">
							<image class="submit-icon" src="@/static/drafts.png" />
						</view>
						<view style="margin-top: 28rpx;">
							<text class="submit-text">已保存进草稿箱</text>
						</view>
						<view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx;">
							<text>您可以进入草稿箱查看</text>
						</view>
						<button @click="sureThree" style="border-radius: 20rpx; background-color: rgba(69, 145, 254, 1);
					color: rgba(255, 255, 255, 1);width: 300rpx;margin-top: 27rpx;">确定</button>
					</view>
				</view>
			</uni-popup>
		</view>


	</view>
</template>

<script>
	import moment from 'moment';
	export default {
		data() {
			return {
				Auth_Company_Id: "",
				dataTree:[],
				uniDeptDataPicker: '',
				id: Math.floor(Math.random() * 10000000000000000000) + Date.now(),
				userId: '',
				dataObj: {

				},
				myFormData: {
					jobTransferType: '',
					newWorkNoFlag: '',
					newWorkNo: '',
					newCompany: '',
					newDepartIds: '',
					newPost: '',
					newPostLevel: '',
					newPostBelong: '',
					reason: '',
					newWorkshop: '',
					newClasses: '',
					newFreightBasis: '',
					newClassification: '',
				},
				deptLoading:false,
				selectDeptObj:{},
				uniDeptDataShow:[]
			}
		},
		mounted() {
			this.Auth_Company_Id = uni.getStorageSync("Auth_Company_Id")
			this.getTree()
		},
		onLoad: function(option) {
			uni.$on('departCallBack', (data) => {
				this.$set(this.myFormData, 'newDepartIds', data?.idArray?.join(','))
				this.$set(this.myFormData, 'newDepartTitle', data?.titleArray?.join('>'))
			})
		},
		watch: {
			userId: {
				immediate: true,
				handler(val, old) {
					console.log("dataObject.userId值变化")
					console.log(val)
					console.log(old)
					this.userId = val;
					if (this.userId != '') {
						this.queryUserByUserId()
					}
				},
			},
			'myFormData.newWorkNoFlag': {
				immediate: true,
				handler(val, old) {
					if (val == '1') {
						console.log('this.myFormData.newCompany',this.myFormData.newCompany)
						console.log('this.dataObj.departIds',this.dataObj.departIds)
						console.log(' this.dataObj.idCard',this.dataObj.idCard)
						this.$http.post(
								'/crm_employment_application/crmEmploymentApplication/generateWorkNo/', {
									"company": this.myFormData.newCompany,
									"departIds": this.dataObj.departIds,
									"idCard": this.dataObj.idCard
								})
							.then(res => {
								console.log('res',res)
								if (res.data.success) {
									this.myFormData.newWorkNo = res.data.result
								} else {
									this.$tip.toast('获取失败')
								}
							}).catch(() => {
								this.$tip.loaded();
								this.$tip.toast('获取失败')
							});
					}
				},
			},
			uniDeptDataPicker: {
				immediate: true,
				handler(val, old) {
					if (val.length > 0) {
						let deptIds = []
						val.forEach((item) => {
							deptIds.push(item.value)
						})
						this.dataObj.departIds = deptIds.join(',')
						this.myFormData.newDepartIds =  deptIds.join(',')
					}
				},
			},
			'myFormData.jobTransferType': {
				immediate: true,
				handler(val, old) {
					if (val) {
						 if(val == "1" || val == "2") {
							// this.$refs.cascadeSelectionDept.getDeptDataNew(JSON.parse(localStorage.getItem(
							// 	'login_user_info')).data.company)
							// this.$refs.cascadeSelectionDept.getDeptDataNew(JSON.parse(uni.getAccountInfoSync(
							// 	'login_user_info')).data.company)
								if(this.dataObj.company) {
									this.deptLoading = true
									let params = {};
									if (this.dataObj.company != '' && this.dataObj.company != '') {
										params = {
											company: this.dataObj.company
										}
									}
									this.$http.get('/sys/sysDepart/queryTreeListTileChangeTree', {
										params: params
									}).then((res) => {
										if (res.data.success) {
											console.log('getDeptDataNew',res.data)
											this.dataTree = res.data.result.tree
											this.deptLoading = false
										}
									})
									}
							
						} else {
							
								// this.$refs.cascadeSelectionDept.getDeptDataNew()
								this.getTree()
							
						}
					}
				},
			}
		},
		computed: {

		},
		methods: {
			onnodeclick(e) {
				console.log('eee',e);
				if (e.orgCategory == 5) {
					this.myFormData.newWorkshop = e.title
				} else if (e.orgCategory == 7) {
					this.myFormData.newClassification = e.title
				} else if (e.orgCategory == 6) {
					this.myFormData.newClasses = e.title
				} else if (e.orgCategory == 3) {
					this.myFormData.newPost = e.title
					this.myFormData.newFreightBasis = e.freightBasis
					this.myFormData.newPostType = e.postType
				} else if (e.orgCategory == 1) {
					this.myFormData.newCompanyName = e.title
					this.myFormData.newCompany = e.id
				}
			},
			clear(){},
			getTree(){
				this.deptLoading = true
					this.$http.get('/sys/sysDepart/queryTreeList').then((res) => {
						if (res.data.success) {
							console.log('getDeptData',res.data)
							this.dataTree = res.data.result
							this.deptLoading = false
						}
					})
			},
			onchange(e){
				this.uniDeptDataShow =  e.detail.value.slice(1)
				this.uniDeptDataPicker = e.detail.value
				console.log('this.uniDeptDataShow',this.uniDeptDataShow)
			},
			queryUserByUserId() {
				this.$http.get('/crm_user/crmUser/queryById', {
					params: {
						id: this.userId
					}
				}).then(res => {
					console.log("res-dataObj", res)
					if (res.data.success) {
						this.dataObj = res.data.result
					}
				}).catch(err => {
					console.log(err);
				});
			},
			ChooseDepartIds() {
				uni.navigateTo({
					url: '/pages/oa/common/depart',
				});
			},
			submit() {
				console.log('this.myFormData',this.myFormData)
				console.log('this.dataObj',this.dataObj)
				
				this.$http.post('/crm_job_transfer_application/crmJobTransferApplication/add', {
					"approvalStatus": "2",
					"jobTransferType": this.myFormData.jobTransferType,
					"newWorkNoFlag": this.myFormData.newWorkNoFlag,
					"newWorkNo": this.myFormData.newWorkNoFlag ==1 ? this.myFormData.newWorkNo : '',
					"newCompany": this.myFormData.newCompany,
					"newDepartIds": this.myFormData.newDepartIds,
					"newOrgCodeTxt": this.myFormData.newOrgCodeTxt,
					"newPost": this.myFormData.newPost,
					"newWorkshop": this.myFormData.newWorkshop,
					"newClasses": this.myFormData.newClasses,
					"newFreightBasis": this.myFormData.newFreightBasis,
					"newClassification": this.myFormData.newClassification,
					"reason": this.myFormData.reason,
					"id": this.id,
					"userId": this.userId,
				}).then(res => {
					if (res.data.success) {
						setTimeout(() => {
							this.$http.post(
									'/crm_job_transfer_application/crmJobTransferApplication/submitTrial/' +
									this.id)
								.then(res => {
									if (res.data.success) {
										this.$refs.submitFlag.open('center')
									} else {
										this.$tip.toast('提交审核失败')
									}
								}).catch(() => {
									this.$tip.loaded();
									this.$tip.toast('提交审核失败')
								});
						}, 100)
					} else {
						this.$tip.toast(res.data.message)
					}
				}).catch(() => {
					this.$tip.loaded();
					this.$tip.toast('提交失败')
				});
			},
			sureOne() {
				this.$refs.submitFlag.close()
				uni.navigateTo({
					url: '/pages/oa/crm_job_transfer_list/index'
				})
			},
			save() {
				let data = {
					
						"approvalStatus": "1",
						"jobTransferType": this.myFormData.jobTransferType,
						"newWorkNoFlag": this.myFormData.newWorkNoFlag,
						"newWorkNo": this.myFormData.newWorkNoFlag ==1 ? this.myFormData.newWorkNo : '',
						"newCompany": this.myFormData.newCompany,
						"newDepartIds": this.myFormData.newDepartIds,
						"newOrgCodeTxt": this.myFormData.newOrgCodeTxt,
						"newPost": this.myFormData.newPost,
						"newWorkshop": this.myFormData.newWorkshop,
						"newClasses": this.myFormData.newClasses,
						"newFreightBasis": this.myFormData.newFreightBasis,
						"newClassification": this.myFormData.newClassification,
						"reason": this.myFormData.reason,
						"id": this.id,
						"userId": this.userId,
					
				}
				console.log('dataaaa',data)
				this.$http.post('/crm_job_transfer_application/crmJobTransferApplication/add',data).then(res => {
					console.log('rrrres',res)
					if (res.data.success) {
						this.$refs.draftsFlag.open('center')
					} else {
						this.$tip.toast(res.data.message)
					}
				}).catch(() => {
					this.$tip.loaded();
					this.$tip.toast('提交失败')
				});
			},
			sureThree() {
				this.$refs.draftsFlag.close()
				uni.navigateTo({
					url: '/pages/oa/crm_job_transfer_list/jobTransferDrafts/index'
				})
			},
			changeDept(item) {
				console.log('item',item)
				this.myFormData.newCompany = item.companyId
				this.myFormData.newCompanyName = item.company
				this.myFormData.newPost = item.post
				this.myFormData.newWorkshop = item.workshop
				this.myFormData.newClasses = item.classes
				this.myFormData.newFreightBasis = item.freightBasis
				this.myFormData.newClassification = item.classification
			}
		}
	}
</script>

<style lang="scss" scoped>
	image {
		width: 100%;
		height: 100%;
	}

	.blackList {
		height: 100%;
		overflow: hidden;
	}

	.page-search {
		padding-left: 34rpx;
		margin-bottom: 12rpx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.search {
		width: 680rpx;
		height: 86rpx;
		background-color: rgba(249, 249, 249, 1);
		border-radius: 60rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-left: 24rpx;
		padding-right: 24rpx;

		.search-left {
			width: 28rpx;
			height: 28rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.search-center {
			margin-left: 22rpx;
		}

		.search-placeholder {
			font-size: 28rpx;
			font-weight: 400;
			color: #7C7C7C;
		}


	}

	.filter-btn {
		width: 40rpx;
		height: 40rpx;
		margin-right: 42rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.page-content-main {
		height: calc(100% - 12rpx - 86rpx);
		border-top-left-radius: 64rpx;
		border-top-right-radius: 64rpx;
		padding: 26rpx 34rpx 0 34rpx
	}

	.select-box {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;

	}

	.select {
		width: 160rpx;
		height: 74rpx;
		border-radius: 60rpx;
		background-color: #4591FE;
		margin-bottom: 20rpx;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		margin-right: 48rpx;
		position: relative;

		.select-value {
			font-size: 28rpx;
			font-weight: 400;
			color: #FFFFFF;
			margin-right: 18rpx;
		}

		.select-icon {
			width: 22rpx;
			height: 22rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			position: absolute;
			right: 20rpx;
			top: 25rpx;
		}
	}

	.list {
		height: calc(100% - 74rpx - 20rpx);
	}

	.list-item {
		border-radius: 28rpx;
		background-color: #FFFFFF;
		padding: 26rpx 24rpx 28rpx 20rpx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		margin-bottom: 26rpx;
		position: relative;

		.list-item-leftCenter {
			display: flex;
			flex-direction: row;
		}

		.list-item-left {
			width: 86rpx;
			height: 86rpx;
			margin-right: 26rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.list-item-center {
			.list-item-row {
				display: flex;
				flex-direction: row;
				margin-bottom: 20rpx;

				.list-item-name {
					color: #101317;
					font-size: 32rpx;
					margin-right: 16rpx;
				}

				.list-item-sex {
					width: 106rpx;
					height: 42rpx;
					border-top-right-radius: 40rpx;
					border-bottom-right-radius: 40rpx;
					border-bottom-left-radius: 20rpx;
					background-color: rgba(234, 171, 78, 0.35);
					line-height: 42rpx;
					text-align: center;
					color: rgba(255, 173, 4, 1);
					font-size: 24rpx;
				}

				.list-item-row-icon {
					width: 38rpx;
					height: 38rpx;
					margin-right: 10rpx;
					display: flex;
					justify-content: center;
					align-items: center;
				}

				.list-item-row-title,
				.list-item-row-value {
					font-size: 24rpx;
					font-weight: 400;
					color: #101317;
					line-height: 38rpx;
				}

			}
		}

		.list-item-btn {
			width: 36rpx;
			height: 36rpx;
			margin-top: 56rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.list-item-tab {
			width: 132rpx;
			height: 56rpx;
			text-align: center;
			line-height: 56rpx;
			background-color: rgba(69, 145, 254, 0.4);
			position: absolute;
			top: 0;
			right: 0;
			border-top-right-radius: 26rpx;
			border-bottom-left-radius: 20rpx;
		}

		.list-item-tab-text {
			font-size: 26rpx;
			color: rgba(69, 145, 254, 1)
		}
	}

	.nav-right-image {
		width: 80rpx;
		height: 80rpx;
		margin-left: 15px;
	}


	.cu-form-group {
		background-color: transparent;
	}

	::v-deep {
		.cu-form-group uni-picker .picker {
			color: #FFFFFF;
		}

		.cu-form-group uni-picker::after {
			opacity: 0;
		}
	}

	.textView {
		margin-left: 25px;
		font-size: 10px;
		margin-top: 5px;
	}

	.listText {
		width: 148rpx;
		height: 24rpx;
		font-size: 20rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #000000;
		line-height: 24rpx;
	}

	/deep/ .uni-radio-input {
		width: 10px;
		height: 10px;
	}

	.submit-icon {
		width: 118rpx;
		height: 118rpx;
		margin-top: 58rpx;
	}
</style>
